@if $use-dropdowns == true {
  //------------------------------------
  //  DROPDOWNS
  //------------------------------------
  .dropdown {
    cursor: pointer;
    outline: none;
    position: relative;
    width: auto;

    .dropdown-menu {
      background-color: $dropdown-bg-color;
      border: 1px solid $dropdown-border-color;
      border-radius: inherit;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
      filter: alpha(opacity=0);
      font-weight: inherit;
      left: 0;
      margin-left: 0px;
      opacity: 0;
      pointer-events: none;
      position: absolute;
      right: 0;
      text-transform: none;
      z-index: 99999;

      @include vendor(transition, all 0.3s ease-in, ms official);

      a { text-decoration: none; }

      p {
        margin: 0;
        padding: 10px 15px;
      }

      span { line-height: inherit; }

      img {
        padding: 15px;
        width: 100%;
      }

      iframe {
        height: auto;
        padding: 15px;
        width: 100%;
      }

      img + p,
      iframe + p { padding-top: 0px; }

      hr { margin: 10px; }

      li {
        display: block;
        padding: 5px 10px;

        @include vendor(transition, all 0.3s ease-out, ms official);
      }

      li:hover { background-color: $dropdown-hover-color; }


      // Headers
      & > .dropdown-header { margin: 0; }
    }

    ul.dropdown-menu { list-style-type: none; }

    &.dropdown-active .dropdown-menu {
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
      filter: alpha(opacity=100);
      opacity: 1;
      pointer-events: auto;
    }

    .dropdown-header {
      color: $dropdown-header-color;
      cursor: default;
      @include font-size(14px);
      margin: 12px 0 0;
      padding: 0 0 0 9px;
    }

    &.dropdown-collapse-full .dropdown-menu { width: 100%; }

    @include breakpoint(small) {
      & {
        .dropdown-menu { width: 200px; }

        &.dropdown-small .dropdown-menu { width: 150px; }

        &.dropdown-large .dropdown-menu { width: 350px; }

        &.dropdown-full .dropdown-menu { width: 100%; }

        &.dropdown-collapse-full .dropdown-menu { width: 200px; }
      }
    }

    .dropdown-header:hover,
    li.dropdown-header:hover { background: none; }


    // Arrows
    &[class*='dropdown-arrow-'] .dropdown-menu {
      margin-top: 10px;

      &:before,
      &:after {
        border-color: $dropdown-bg-color transparent;
        border-style: solid;
        bottom: 100%;
        border-width: 0 6px 6px 6px;
        content: "";
        height: 0;
        position: absolute;
        width: 0;
      }

      &:before {
        border-color: rgba(0, 0, 0, 0.1) transparent;
        border-width: 0 8px 8px 8px;
      }
    }

    &.dropdown-arrow-left .dropdown-menu {
      &:after { left: 15px; }

      &:before { left: 13px; }
    }

    &.dropdown-arrow-right .dropdown-menu {
      &:after { right: 15px; }

      &:before { right: 13px; }
    }


    // Dropup
    &.up {
      .dropdown-menu { bottom: 100%; }

      &[class*='dropdown-arrow-'] .dropdown-menu {
        margin-bottom: 10px;

        &:after, &:before { top: 100%; }

        &:after { border-width: 6px 6px 0 6px; }

        &:before { border-width: 8px 8px 0 8px; }
      }
    }
  }
}
